<meta charset="UTF-8">
<style type="text/css">
    .carousel-inner{
    }
    
	.carousel-inner ul li{
		width:23%;
		height:300px;
		text-align:left;
		vertical-align:top;
	}
	
	/*轮播图片*/
	.carousel-inner ul li img{
		width:100%;
		height:75%;
	}
	
	@media screen and (max-height:800px){
		.carousel-inner ul li img{
				width:100%;
				height:50%;
		}
	}
	
	/*轮播控制按钮*/
	.carousel-control{
		width:50px;
	    padding-top: 3%;
	    font-size: 100px;
	    font-weight: bold;
	    color: #B5B6B1;
		opacity:1;
	}
	.carousel-control:hover{
		color: #B5B6B1;
		opacity:1;
	}
</style>
<ul id="myTab" class="nav nav-tabs">
   <li class="active"><a href="#recommendFeaturespot" data-toggle="tab" style="color:#337ab7;">推荐景点 </a></li>
   <li><a href="#recommendAround" data-toggle="tab" style="color:#337ab7;">推荐周边游</a></li>
</ul>
<div id="myTabContent" class="tab-content">
   <div class="tab-pane fade in active" id="recommendFeaturespot">
      <div class="row whole-row" style="height:300px; margin-top:20px;">
	      <div id="myCarousel_featurespot" class="carousel slide col-xs-12 col-sm-12 col-md-12 col-lg-12" style="height:100%;">
		   <!-- 轮播（Carousel）项目 -->
		   <div class="carousel-inner text-center" style="height:100%;">
		      <div class="item active">
		      	<ul class="list-inline">
				  <notempty name="recommendAttrList[0]">
		      			<li>
		  					<a href="{:U('Index/featureSpotDetail')}?id={$recommendAttrList[0].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAttrList[0].first_img_path}" alt="{$recommendAttrList[0].name}">
		  				    
		  				    <div class="img-about" style="">{$recommendAttrList[0].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAttrList[0].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				  </notempty>
				  <notempty name="recommendAttrList[1]">
		      			<li>
		  					<a href="{:U('Index/featureSpotDetail')}?id={$recommendAttrList[1].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAttrList[1].first_img_path}" alt="{$recommendAttrList[1].name}">
		  				    <div class="img-about" style="">{$recommendAttrList[1].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAttrList[1].price}</strong><strong>起</strong></div>
	  				   		</a>
	  				    </li>
  				   </notempty>
				  <notempty name="recommendAttrList[2]">
		      			<li>
		  					<a href="{:U('Index/featureSpotDetail')}?id={$recommendAttrList[2].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAttrList[2].first_img_path}" alt="{$recommendAttrList[2].name}">
		  				    <div class="img-about" style="">{$recommendAttrList[2].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAttrList[2].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   </notempty>
				  <notempty name="recommendAttrList[3]">
		      			<li>
		  					<a href="{:U('Index/featureSpotDetail')}?id={$recommendAttrList[3].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAttrList[3].first_img_path}" alt="{$recommendAttrList[3].name}">
		  				    <div class="img-about" style="">{$recommendAttrList[3].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAttrList[3].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   	</notempty>
				</ul>
		      </div>
		      <notempty name="recommendAttrList[4]">
		      <div class="item">
		         <ul class="list-inline">
				  <notempty name="recommendAttrList[4]">
		      			<li>
		  					<a href="{:U('Index/featureSpotDetail')}?id={$recommendAttrList[4].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAttrList[4].first_img_path}" alt="{$recommendAttrList[4].name}">
		  				    <div class="img-about" style="">{$recommendAttrList[4].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAttrList[4].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   </notempty>
				  <notempty name="recommendAttrList[5]">
		      			<li>
		  					<a href="{:U('Index/featureSpotDetail')}?id={$recommendAttrList[5].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAttrList[5].first_img_path}" alt="{$recommendAttrList[5].name}">
		  				    <div class="img-about" style="">{$recommendAttrList[5].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAttrList[5].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				    </notempty>
				  <li>
				  </li>
				  <li>
			  	  </li>
				</ul>
		      </div>
		      </notempty>
			   </div>
			   <a class="carousel-control left" href="#myCarousel_featurespot" 
			      data-slide="prev" style="background-image:none;">&lsaquo;</a>
			   <a class="carousel-control right" href="#myCarousel_featurespot" 
			      data-slide="next" style="background-image:none;">&rsaquo;</a>
			   </div>
		   </div>
	  </div>
   <div class="tab-pane fade" id="recommendAround">
      <div class="row whole-row" style="height:300px; margin-top:20px;">
	      <div id="myCarousel_around" class="carousel slide col-xs-12 col-sm-12 col-md-12 col-lg-12" style="height:100%;">
		   <!-- 轮播（Carousel）指标 -->
		   <ol class="carousel-indicators">
		      <li data-target="#myCarousel_around" data-slide-to="0" class="active"></li>
		      <li data-target="#myCarousel_around" data-slide-to="1"></li>
		      <li data-target="#myCarousel_around" data-slide-to="2"></li>
		      <li data-target="#myCarousel_around" data-slide-to="3"></li>
		   </ol>   
		   <!-- 轮播（Carousel）项目 -->
		   <div class="carousel-inner text-center" style="height:100%;">
		      <div class="item active">
		      	<ul class="list-inline">
		      		 <notempty name="recommendAroundList[0]">
		      			<li>
		  					<a href="{:U('Index/aroundDetail')}?id={$recommendAroundList[0].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAroundList[0].first_img_path}" alt="{$recommendAroundList[0].name}">
		  				    <div class="img-about" style="">{$recommendAroundList[0].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAroundList[0].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				  </notempty>
				  <notempty name="recommendAroundList[1]">
		      			<li>
		  					<a href="{:U('Index/aroundDetail')}?id={$recommendAroundList[1].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAroundList[1].first_img_path}" alt="{$recommendAroundList[1].name}">
		  				    <div class="img-about" style="">{$recommendAroundList[1].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAroundList[1].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   </notempty>
				  <notempty name="recommendAroundList[2]">
		      			<li>
		  					<a href="{:U('Index/aroundDetail')}?id={$recommendAroundList[2].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAroundList[2].first_img_path}" alt="{$recommendAroundList[2].name}">
		  				    <div class="img-about" style="">{$recommendAroundList[2].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAroundList[2].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   </notempty>
				  <notempty name="recommendAroundList[3]">
		      			<li>
		  					<a href="{:U('Index/aroundDetail')}?id={$recommendAroundList[3].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAroundList[3].first_img_path}" alt="{$recommendAroundList[3].name}">
		  				    <div class="img-about" style="">{$recommendAroundList[3].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAroundList[3].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   	</notempty>
				</ul>
		      </div>
		      <notempty name="recommendAroundList[4]">
		      <div class="item">
		         <ul class="list-inline">
				  <notempty name="recommendAroundList[4]">
		      			<li>
		  					<a href="{:U('Index/aroundDetail')}?id={$recommendAroundList[4].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAroundList[4].first_img_path}" alt="{$recommendAroundList[4].name}">
		  				    <div class="img-about" style="">{$recommendAroundList[4].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAroundList[4].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				   </notempty>
				  <notempty name="recommendAroundList[5]">
		      			<li>
		  					<a href="{:U('Index/aroundDetail')}?id={$recommendAroundList[5].id}">
			  					<img src="__PUBLIC__/Uploads/{$recommendAroundList[5].first_img_path}" alt="{$recommendAroundList[5].name}">
		  				    <div class="img-about" style="">{$recommendAroundList[5].about}</div>
		  				    <div class="img-about" style=""><strong>义达价：</strong><strong style="color:#DA8C47;">&yen;{$recommendAroundList[5].price}</strong><strong>起</strong></div>
		  				    </a>
	  				    </li>
  				    </notempty>
				  <li>
				  </li>
				  <li>
			  	  </li>
				</ul>
		      </div>
		      </notempty>
			   </div>
			   <a class="carousel-control left" href="#myCarousel_around" 
			      data-slide="prev" style="background-image:none;">&lsaquo;</a>
			   <a class="carousel-control right" href="#myCarousel_around" 
			      data-slide="next" style="background-image:none;">&rsaquo;</a>
			   </div>
	  </div>
   </div>
</div>
      

      
